// 源插件
import React, { PureComponent } from 'react';
import { DateDiff, DateStamp, FormatnumberZero, Mover, NumberDivide } from '@/function.js';
// 视图插件
import { Button, Card, Form, message, notification } from 'antd';
// 外部组件
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import StandardTablePro from '@/components/UpgradeStandardTable/StandardTablePro';
import { connect } from 'dva';
// css OR less预编译器

// 图片

/**
 *  Describe:数据连接
 */

@connect(({ guo, loading }) => ({
  guo,
  loading: loading.models.guoRule,
}))
@Form.create()
class Stock extends PureComponent {
  componentWillMount() {}

  /**
   *  Describe:当前状态
   */

  state = {
    listLoading: false, // 加载状态
    dataSource: {
      data: [],
      total: [],
      code: 0,
    },
  };

  dataSourcechange() {
    const { dispatch } = this.props;
    const that = this;
    dispatch({
      type: 'guo/GetUBSPosition',
      payload: 3,
      callback: res => {
        that.setState({
          dataSource: {
            title: `${res.list.dataState > 0 ? '(临时)' : '(正式)'}郭老师股票持仓${
              (res.list.uploadDate || '').split(' ')[0]
            }`,
            code: 1,
            data: res.list.positionList,
            total: ['costmoney', 'thisincome', 'allincome'],
            columns: [
              {
                title: '股票代码',
                dataIndex: 'stock',
                width: 110,
                type: 'string',
                sorter: true,
                search: true,
              },
              {
                title: '涨跌幅',
                dataIndex: 'gain',
                width: 90,
                type: 'number',
                sorter: true,
                render: (value, row, index) => {
                  return (
                    <span style={{ color: value > 0 ? '#389e0d' : '#e1111e' }}>
                      {typeof value === 'number' || typeof value === 'string'
                        ? `${FormatnumberZero(value, 2).toString()}%`
                        : null}
                    </span>
                  );
                },
              },
              {
                title: '盈亏幅度',
                dataIndex: 'gainrate',
                width: 90,
                type: 'number',
                sorter: true,
                render: (value, row, index) => {
                  return (
                    <span>
                      {typeof value === 'number' || typeof value === 'string'
                        ? `${NumberDivide((value * 100).toFixed(2).toString())}%`
                        : null}
                    </span>
                  );
                },
              },
              {
                title: '剩余SC数量',
                dataIndex: 'lastscnum',
                width: 90,
                type: 'number',
                sorter: true,
              },
              {
                title: 'ATR',
                dataIndex: 'atr',
                type: 'number',
                width: 75,
                sorter: true,
                render: (value, row, index) => {
                  return (
                    <span>
                      {typeof value === 'number' || typeof value === 'string'
                        ? FormatnumberZero(value, 2).toString()
                        : null}
                    </span>
                  );
                },
              },
              {
                title: '买卖方向',
                dataIndex: 'typename',
                type: 'string',
                width: 60,
                filters: [
                  {
                    text: '多头',
                    value: '多头',
                  },
                  {
                    text: '空头',
                    value: '空头',
                  },
                ],
              },
              {
                title: '市值',
                dataIndex: 'costmoney',
                type: 'number',
                width: 100,
                sorter: true,
              },
              {
                title: '成本价',
                width: 75,
                dataIndex: 'costprice',
                type: 'number',
                sorter: true,
              },
              {
                title: '最新价',
                width: 75,
                dataIndex: 'stockprice',
                type: 'number',
                sorter: true,
              },
              {
                title: '股数',
                dataIndex: 'stocknumber',
                width: 75,
                type: 'number',
                sorter: true,
              },
              {
                title: '当日盈亏',
                dataIndex: 'thisincome',
                type: 'number',
                width: 100,
                sorter: true,
                render: (tags, record) => {
                  if (record.stock === '合计') {
                    return (
                      <span>
                        {typeof tags === 'number' || typeof tags === 'string'
                          ? `${NumberDivide(tags.toString())}/${(
                              (tags / record.costmoney) *
                              100
                            ).toFixed(2)}%`
                          : null}
                        {}
                      </span>
                    );
                  }
                  return (
                    <span>
                      {typeof tags === 'number' || typeof tags === 'string'
                        ? NumberDivide(tags.toString())
                        : null}
                    </span>
                  );
                },
              },
              {
                title: '盈亏金额',
                dataIndex: 'allincome',
                width: 100,
                type: 'number',
                sorter: true,
              },

              {
                title: '止损价格',
                dataIndex: 'lostprice',
                width: 75,
                type: 'number',
                sorter: true,
              },
              {
                title: '最高价',
                dataIndex: 'highprice',
                width: 75,
                type: 'number',
                sorter: true,
              },
              {
                title: '回撤',
                dataIndex: 'withdrawal',
                width: 75,
                type: 'number',
                sorter: true,
              },
              {
                title: '开仓时间',
                dataIndex: 'tradedate',
                width: 100,
                type: 'date',
                sorter: true,
                render: (value, row, index) => {
                  return <span>{typeof value === 'string' ? value.split(' ')[0] : ''}</span>;
                },
              },
            ],
          },
        });
      },
    });
  }

  render() {
    return (
      <PageHeaderWrapper>
        <Card>
          <StandardTablePro dataSource={this.state.dataSource} />
        </Card>
      </PageHeaderWrapper>
    );
  }

  componentDidMount() {
    this.dataSourcechange();
  }

  componentWillUnmount() {}
}

export default Stock;
